<template>
  <div class="body">
    <!-- <el-button type="info" icon="el-icon-refresh-right"></el-button> -->
 
    <!-- <el-button type="primary" icon="el-icon-edit" @click="handleUpdate">编辑</el-button> -->
    <!-- <el-button type="danger" @click="del()" icon="el-icon-delete">删除</el-button> -->
    <!-- <el-button type="primary" icon="el-icon-upload2">导出</el-button> -->
        <el-row  class="mb8">
            <el-col :span="19">
                <el-button type="info" @click="shuaxin" icon="el-icon-refresh-right"></el-button>
               <!-- <el-button type="success"  @click="handleAdd">添加</el-button> -->
            </el-col>
            <el-col :span="5" class="seach">
                <el-input v-model="jigouName" placeholder="请输入"></el-input>
                <el-button type="primary" icon="el-icon-search" @click="seach"></el-button>
            </el-col>
        </el-row>
    <el-table
      ref="multipleTable"
      :data="bidlist"
      tooltip-effect="dark"
      class="table xinde"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55"></el-table-column>
      <el-table-column prop="id" label="序号" width="50"></el-table-column>
      <el-table-column prop="old_project_id" align="center" label="原公告的采购项目编号" show-overflow-tooltip="true"
               width="220"></el-table-column>
      <el-table-column prop="old_project_name" align="center" label="原公告的采购项目名称" show-overflow-tooltip="true"
               width="220"></el-table-column>
      <el-table-column prop="matter" :show-overflow-tooltip="true" 
               width="220" align="center" label="更正事项" ></el-table-column>
      <el-table-column prop="purchase_person_name" align="center" label="采购人名称" show-overflow-tooltip="true"
               width="220"></el-table-column>
      <el-table-column prop="bidder_notice_time" align="center" label="结果公告日期" show-overflow-tooltip="true"
               width="220" >
                  <template
          slot-scope="scope"
        >{{scope.row.old_project_time }}</template>
               </el-table-column>
      <el-table-column prop="review_time" align="center" label="更正日期" show-overflow-tooltip="true"
               width="220">
               <template
          slot-scope="scope"
        >{{scope.row.time }}</template>
        </el-table-column>
      <!-- <el-table-column prop="content" align="center" label="采购需求内容" width="130"></el-table-column> -->
      <el-table-column prop="purchase_person_addr" align="center" label="采购人地址" show-overflow-tooltip="true"
                width="220"></el-table-column>
      <el-table-column prop="project_person" align="center" label="项目联系人" show-overflow-tooltip="true"
               width="220"></el-table-column>
      <el-table-column prop="project_mobile" align="center" :show-overflow-tooltip="true" label="项目联系方式" 
               width="220"></el-table-column>
      <el-table-column prop="amend_detail" align="center" label="更正内容之详情" show-overflow-tooltip="true"
               width="220"></el-table-column>
      <!-- <el-table-column align="center" label="资金来源" show-overflow-tooltip="true"
               width="120">
        <template
          slot-scope="scope"
        >{{scope.row.moneysource==0?'政府资金':scope.row.moneysource==1?'自筹资金':'其他自己资金'}}</template>
      </el-table-column> -->
      <el-table-column fixed="right" width="140" align="center" label="操作">
        <template slot-scope="scope">
          <el-button @click="details(scope.row)" type="text" size="small">查看详情</el-button>
      <!-- <el-button type="text" size="small" @click="skipRoute(scope.row)">申请保函</el-button> -->
        </template>
      </el-table-column>
    </el-table>

    <!-- 新增或修改 -->

    <el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
      <!-- {{form}}  //测试 -->
      <el-form ref="form" :model="form" :rules="rules" label-width="160px">
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="采购项目编号">
              <el-input v-model="form.bidding_number"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="包号">
              <el-input v-model="form.bidding_project_number"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="采购项目名称">
              <el-input v-model="form.bidding_project_name"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="采购方式">
              <el-input v-model="form.bidding_type"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="招标公告发布日期">
              <el-date-picker
                value-format="timestamp"
                v-model="form.bidder_notice_time"
                type="date"
                placeholder="选择日期时间"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="评审日期">
              <el-date-picker
                value-format="timestamp"
                v-model="form.review_time"
                type="date"
                placeholder="选择日期时间"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="采购内容">
              <el-input v-model="form.content"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="标段名称">
              <el-input v-model="form.bidding_name"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="中标金额">
              <el-input v-model="form.margin_amount"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="供应商名称">
              <el-input v-model="form.company_name"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="信息来源">
              <el-select v-model="form.source" placeholder="请选择">
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="资金来源">
              <el-select v-model="form.moneysource" placeholder="请选择">
                <el-option
                  v-for="item in options1"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <div class="button">
          <el-button type="primary" @click="onSubmit">确定</el-button>
          <el-button @click="cancel">取消</el-button>
        </div>
      </el-form>
    </el-dialog>
    <!-- 详情 -->
    <el-dialog :title="title" :visible.sync="open1" width="60%" append-to-body>
      <el-form ref="form" :disabled="true" :model="form" :rules="rules" label-width="130px">
        <el-row :gutter="10">
          <el-col :span="8">
            <el-form-item label="项目编号:">
              <el-input
                v-model="formData.bidding_number"
                placeholder="请输入项目编号:"
                show-word-limit
                clearable
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="130px" label="采购项目名称：">
              <el-input
                v-model="formData.bidding_project_name"
                placeholder="请输入采购项目名称："
                clearable
                :style="{width: '100%'}"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="130px" label="采购方式：">
              <el-input
                v-model="formData.bidding_type"
                placeholder="请输入采购方式："
                clearable
                :style="{width: '100%'}"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="130px" label="预算金额：">
              <el-input
                v-model="formData.margin_amount"
                placeholder="请输入预算金额："
                clearable
                :style="{width: '100%'}"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="130px" label="包号：">
              <el-input
                v-model="formData.bidding_project_number"
                placeholder="请输入包号："
                clearable
                :style="{width: '100%'}"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="统一信用代码：">
              <el-input v-model="formData.unify_code" clearable :style="{width: '100%'}"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label-width="130px" label="公司名称：">
              <el-input
                v-model="formData.company_name"
                placeholder="暂无数据"
                clearable
                :style="{width: '100%'}"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="bottom">
        <el-tabs type="border-card">
          <el-tab-pane>
            <span slot="label">采购需求</span>
            {{formData.content}}
          </el-tab-pane>
          <!-- <el-tab-pane label="申请人资格需求">{{formData.qualification}}</el-tab-pane> -->
          <el-tab-pane label="时间地点">
            <p>添加时间：{{formData.create_time|dateFormat}}</p>
          </el-tab-pane>
          <!-- <el-tab-pane label="采购人资料">
              <el-row :gutter="15">
                <el-form
                  :disabled="true"
                  ref="elForm"
                  :model="formData"
                  :rules="rules"
                  size="medium"
                  label-width="100px"
                >
                  <el-col :span="12">
                    <el-form-item label-width="180px" label="采购人名称：" prop="purchase_person_name">
                      <el-input
                        v-model="formData.purchase_person_name"
                        placeholder="请输入采购人名称："
                        clearable
                        :style="{width: '100%'}"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label-width="180px" label="采购人地址:" prop="purchase_person_addr">
                      <el-input
                        v-model="formData.purchase_person_addr"
                        placeholder="请输入采购人地址:"
                        clearable
                        :style="{width: '100%'}"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label-width="180px"
                      label="采购人联系人："
                      prop="purchase_person_contact_name"
                    >
                      <el-input
                        v-model="formData.purchase_person_contact_name"
                        placeholder="请输入采购人联系人："
                        clearable
                        :style="{width: '100%'}"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label-width="180px"
                      label="采购人联系方式："
                      prop="purchase_person_contact_mobile"
                    >
                      <el-input
                        v-model="formData.purchase_person_contact_mobile"
                        placeholder="请输入采购人联系方式："
                        clearable
                        :style="{width: '100%'}"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label-width="180px" label="采购代理机构名称：" prop="purchase_agent_name">
                      <el-input
                        v-model="formData.purchase_agent_name"
                        placeholder="请输入采购代理机构名称："
                        clearable
                        :style="{width: '100%'}"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label-width="180px" label="采购代理机构地址：" prop="purchase_agent_addr">
                      <el-input
                        v-model="formData.purchase_agent_addr"
                        placeholder="请输入采购代理机构地址："
                        clearable
                        :style="{width: '100%'}"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label-width="180px"
                      label="采购代理机构联系人："
                      prop="purchase_agent_person"
                    >
                      <el-input
                        v-model="formData.purchase_agent_person"
                        placeholder="请输入采购代理机构联系人："
                        clearable
                        :style="{width: '100%'}"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item
                      label-width="180px"
                      label="采购代理机构联系方式："
                      prop="purchase_agent_mobile"
                    >
                      <el-input
                        v-model="formData.purchase_agent_mobile"
                        placeholder="请输入采购代理机构联系方式："
                        clearable
                        :style="{width: '100%'}"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                </el-form>
              </el-row>
          </el-tab-pane>-->
        </el-tabs>
      </div>
    </el-dialog>
    <div class="block">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[10,20,30]"
        :page-size="params.limit"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
import { biangeng, addgongcheng, delgongcheng } from "@/api/bid";
export default {
  data() {
    return {
      open1: false,
      //页面
      bidlist: [],
      // 分页获取数据参数
      params: {
        limit: 10,
        offset: 1,
        keywords: ""
      },
      total: null,
      // 信息来源
      options: [
        {
          value: "系统",
          label: "系统"
        },
        {
          value: "新点",
          label: "新点"
        }
      ],
      // 资金来源
      options1: [
        {
          value: 0,
          label: "政府资金"
        },
        {
          value: 1,
          label: "自筹资金"
        },
        {
          value: 2,
          label: "其他资金"
        }
      ],
      formData: {},
      total: null,
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 表单参数
      form: {},
      // 表单校验
      rules: {},
      multipleSelection: []
    };
  },
  created() {
    this.bids();
  },

  methods: {
    shuaxin(){
this.bids();
    },
     skipRoute(uid) {
        let { bidding_name,proid, bidding_number,bidder_notice_time,company_name ,margin_amount,bidding_project_name,bid_end_time,bid_begin_time} = uid;
           sessionStorage.setItem("proid", proid); //当前选择标段id，存储后跳转下一不
           sessionStorage.setItem('projectid',proid)
      sessionStorage.setItem("bidding_name", bidding_name); //当前选择标段id，存储后跳转下一不
        sessionStorage.setItem("proid", proid); //保函id
      sessionStorage.setItem("bidding_name", bidding_number); //项目编号
      sessionStorage.setItem("bidding_project_name", bidding_project_name); //开标日期开标时间:{{ item.bidder_notice_time }}
       sessionStorage.setItem("purchase_person_name", company_name); //招标人
         sessionStorage.setItem("bidder_notice_time", bidder_notice_time); 
        sessionStorage.setItem("bid_begin_time", bid_begin_time); //开标日期
         sessionStorage.setItem("bid_end_time", bid_end_time); //截止时间
      sessionStorage.setItem("margin_amount", margin_amount); //预算金额
      // sessionStorage.setItem("unify_code", this.gongcheng.unify_code); //申请公司统一社会信信用代码
      // sessionStorage.setItem("apply_company_name", this.valse); //申请公司统一社会信信用代码
          sessionStorage.setItem('proid',uid.proid)
      this.$router.push("/BidSecurity/SelectALot/");
      // this.$router.push({ path: '/BidSecurity/SelectALot/', query: { projectid: uid.proid }})
      
    },
    //页面
    bids() {
      // this.params.user_id = sessionStorage.getItem("user_id");
      biangeng(this.params).then(response => {
        console.log(response);
        this.bidlist = response.data.data.rows;
        this.total = response.data.data.total;
      });
    },
    details(rows) {
       var bbc=JSON.stringify(rows)
        this.$router.push({name:'jgbg',query:{params:bbc}});
      // this.open1 = true;
      // this.formData = rows;
    },
    // 表单重置
    reset() {
      this.form = {};
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    //新增按钮操作
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加档案架";
      this.bids();
    },
    //修改
    handleUpdate() {
      this.reset();
      this.open = true;
      this.title = "修改档案架";
      this.bids();
    },
    //提交按钮
    onSubmit() {
      // this.form.user_id = sessionStorage.getItem("user_id");
      addgongcheng(this.form).then(res => {
        if (res.data.code == 1) {
          this.$message.success("添加成功");
          this.bids();
        } else {
          this.$message.error("网络异常,稍后再试");
        }
      });
      this.open = false;
    },
    del() {
      let arr = [];
      this.multipleSelection.forEach(item => {
        arr.push(item.proid);
      });
      arr = arr.toString();
      console.log(arr);
      // let user_id = sessionStorage.getItem("user_id");
      delgongcheng({  ids: arr }).then(res => {
        if (res.data.code == 1) {
          this.$message.success("删除成功");
          this.bids();
        } else {
          this.$message.error("网络异常,稍后再试");
        }
      });
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.params.limit = val;
      this.bids();
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.params.offset = parseInt(val - 1) * this.params.limit;
      this.bids();
    }
  }
};
</script>

<style scoped>
.body {
  /* width: 87vw;
  height: 84vh; */
  /* overflow: auto; */
}
.el-form {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.table {
  width: 100%;
  margin-top: 2vh;
}

.block {
  position: fixed;
  bottom: 20px;
  right: 20px;
}
.el-date-editor.el-input,
.el-date-editor.el-input__inner {
  width: 100%;
}
.el-select {
  width: 100%;
}
</style>
